<title>banner列表</title>
<div class="layui-card layadmin-header">
<div class="layui-breadcrumb" lay-filter="breadcrumb">
    <a lay-href="">主页</a>
    <a><cite>应用</cite></a>
    <a><cite>banner列表</cite></a>
</div>
</div>
<div class="layui-fluid">
    <div class="layui-card">
        <div class="layui-card-body">
            <table id="mybanner" lay-filter="mybanner"></table>
            <script type="text/html" id="table-content-list">
                <a class="layui-btn layui-btn-normal layui-btn-xs" lay-event="change"><i class="layui-icon layui-icon-edit"></i>编辑</a>
                <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del"><i class="layui-icon layui-icon-delete"></i>删除</a>
            </script>
        </div>
    </div>
</div>
<div id="banner_cover_box" style="display: none">
    <img id='banner_cover' src="" alt="" width="100%" height="100%">
</div>
<script type="text/html" id="banner_hide">
    <input type="checkbox" lay-filter="banner_hide" value="{{d.bannerId}}" lay-skin="switch" lay-text="展示|隐藏" {{d.hide=='N'?'checked':''}}/>
</script>
<script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script>
<script>
function showPic (url) {
    layui.admin.popup({
        type:1,
        title:'封面',
        shade: 0,
        area:['500px', '300px'],
        content: $('#banner_cover_box'), 
        offset:'200px',
        success:function() {
            $('#banner_cover').attr('src',url);
        },
        end:function() {
            $('#banner_cover_box').css('display', 'none');
        }
    });
}
layui.use(['admin', 'table','server','laypage'], function(){
    var $ = layui.$
    ,admin = layui.admin
    ,table = layui.table
    ,form = layui.form
    ,server = layui.server
    ,setter = layui.setter
    ,laypage = layui.laypage
    
    var list_options = {
        url: 'windman/bannerList',
        callback: function(success_data) {
            var result = success_data.resultData;
            table.render({
                elem: '#mybanner',
                limit:100,
                cols: [[
                    {field:'bannerId',type: 'checkbox',hide:true},
                    {field: 'novelName',title: '书名'},
                    {field: 'url', title: '图片', templet: function(d) {
                        return '<img class = "banner_cover" onclick="showPic(\''+d.url+'\')" src="'+d.url+'">';
                    }},
                    {field: 'hide', align:'center',templet: '#banner_hide', title: '隐藏'},
                    {fixed: 'right', align:'center', toolbar: '#table-content-list',title:'操作',width:'20%'}
                ]],
                data:result
            });
        }
    };

    server.req(list_options);

});
</script>